$.canui('layout', {
    options: {
        layout: 'border',
        width: null,
        height: null
    },
    items: null,
    _create: function () {
        var _t = this;

        _t._resize(true);
    },
    _setWidth: function () {
        var _t = this;
        if (_t.element[0].tagName === 'BODY') {
            _t.options.width = $(window).width();
            _t.options.height = $(window).height();
            _t.element.css('overflow', 'hidden');
        } else if (!_t.options.width) {
            _t.options.width = $(_t.element).width();
            _t.options.height = $(_t.element).height();
        }
    },
    _getItemWidth: function (obj) {
        return obj ? $(obj).outerWidth() : 0;
    },
    _getItemHeight: function (obj) {
        return obj ? $(obj).outerHeight() : 0;
    },
    _borderInit: function (init) {
        var _t = this;
        var _$items = _t.element.find('>[data-layout]');
        _t.items = {
            north: null,
            south: null,
            west: null,
            east: null,
            center: null
        };
        $.each(_$items, function (i, item) {
            var config = $.strToJson($(item).attr('data-layout'));
            _t.items[config.region] = item;

            switch (config.region) {
                case 'north':
                case 'south':
                    $(item).on('can-resize', function (e, cascade) {
                        var _h = _t.options.height - _t._getItemHeight(_t.items.north) - _t._getItemHeight(_t.items.south);
                        _t.items.west ? $.setHeightExceptBPM(_t.items.west, _h) : '';
                        _t.items.east ? $.setHeightExceptBPM(_t.items.east, _h) : '';
                        _t.items.center ? $.setHeightExceptBPM(_t.items.center, _h) : '';
                        if (cascade) {
                            $(_t.items.west).trigger('can-resize');
                            $(_t.items.east).trigger('can-resize');
                            $(_t.items.center).trigger('can-resize');
                        }
                    });
                    if (config.region == "south") {

                        $('<div style="clear: left;height: 0;"></div>').insertAfter($(item));
                    }
                    break;
                case 'west':
                case 'east':
                    $(item).css('float', 'left').on('can-resize', function (e, cascade) {
                        var _h = _t.options.width - _t._getItemWidth(_t.items.east) - _t._getItemWidth(_t.items.west);
                        _t.items.center ? $.setWidthExceptBPM(_t.items.center, _h) : '';
                        if (cascade) {
                            $(_t.items.center).trigger('can-resize');
                        }
                    });
                    break;
                case 'center':
                    $(item).css('float', 'left');
                    break;
            }
        });

        $('<div style="clear: left;height: 0;"></div>').insertAfter(_t.items.east ? _t.items.east : _t.items.center);

        _t._borderResize(init);

    },
    /**
     * 设置元素高度或者宽度，当前值与现在将设定的值不一致时会触发resize事件
     * @param {HTMLElement} element
     * @param {string} type width or height
     * @param val
     * @param {boolean} init 为true时就不触发resizie事件，默认不填就会触发元素所绑定的resize事件
     * @private
     */
    _setItemHW: function (element, type, val, init) {
        if (!element) {
            return;
        }
        var nowVal = $(element)[type]();
        if (type === 'width') {
            $.setWidthExceptBPM(element, val);
        } else {
            $.setHeightExceptBPM(element, val);
        }

        if (!init && nowVal !== val) {
            //$(element).trigger('resize');
            return true;
        }
    },
    _borderResize: function (init) {
        var _t = this;
        var resizeItem = [];
        $.each(_t.items, function (name, element) {
            var resize = false;
            switch (name) {
                //case 'north':
                //case 'south':
                //    resize = _t._setItemHW(element, 'width', _t.options.width, init);
                //    if (resize) {
                //        resizeItem.push((element));
                //    }
                //    break;
                case 'west':
                case 'east':
                case 'center':
                    var val = _t.options.height
                        - _t._getItemHeight(_t.items.north)
                        - _t._getItemHeight(_t.items.south);
                    //canTool.setHeightExceptBPM(element, val);
                    resize = _t._setItemHW(element, 'height', val, init);
                    if (resize) {
                        resizeItem.push((element));
                    }
                    if (name === 'center') {
                        val = _t.options.width
                            - _t._getItemWidth(_t.items.west)
                            - _t._getItemWidth(_t.items.east);
                        var resize2 = _t._setItemHW(element, 'width', val, init);
                        if (!resize) {
                            if (resize2) {
                                resizeItem.push((element));
                            }
                        }
                        //    canTool.setWidthExceptBPM(element, val);
                    }
                    break;
            }
        });
        $.each(resizeItem, function (index, item) {
            $(item).trigger('can-resize');
        });
    },
    _resize: function (init) {
        var _t = this;
        _t._setWidth();

        if (_t.options.layout === 'border') {
            _t._borderInit(init);
            if (init) {
                $(window).on('resize.layout', function () {
                    _t._setWidth();
                    _t._borderResize();
                });
            }
        }
    }
});